/**
 * Created by dean on 2017/10/15.
 */
import React, {Component} from "react";
import logo from "./logo.svg";
import {Navbar, Nav, NavItem, Glyphicon, MenuItem, NavDropdown} from "react-bootstrap";
class MyNavBar extends Component {
    onLoginClicked() {
        this.props.onLoginClicked();
    }

    render() {
        return (
            <Navbar>
                <Navbar.Header>
                    <Navbar.Brand>
                        <img src={logo} className="App-logo" alt="logo"/>
                    </Navbar.Brand>
                </Navbar.Header>
                <Nav>
                    <NavItem><Glyphicon glyph="home"/>首页</NavItem>
                    <NavItem><Glyphicon glyph="picture"/>图片</NavItem>
                    <NavItem><Glyphicon glyph="book"/>图书</NavItem>
                    <NavItem><Glyphicon glyph="bookmark"/>我的订阅</NavItem>
                    <NavItem><Glyphicon glyph="search"/>ManPage</NavItem>
                    <NavItem><Glyphicon glyph="cloud"/>我的云</NavItem>
                    <NavDropdown title="XXXX" id="xxxx">
                        <MenuItem>MenuItem1</MenuItem>
                        <MenuItem>MenuItem1</MenuItem>
                        <MenuItem>MenuItem1</MenuItem>
                        <MenuItem>MenuItem1</MenuItem>
                        <MenuItem>MenuItem1</MenuItem>
                    </NavDropdown>
                </Nav>
                <Nav className="pull-right">
                    <NavItem ><a href="/login" onClick={this.onLoginClicked.bind(this)}>登陆</a></NavItem>
                </Nav>
            </Navbar>
        )
    }
}

export {MyNavBar}